<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动Bug问题</title>
		<link rel="stylesheet" href="css/浮动Bug.css" />
	</head>
	<body>
		<!-- 浮动  元素一旦浮动起来，页面有元素之间嵌套形成
		float属性一定会产生浮动Bug，主要Bug有两个
		1.浮动塌陷:具备元素嵌套，父元素没有指定高度，子元素浮动
		解决方案1：找到塌陷父元素加高 经验
		解决方案2：给父元素加溢出：overflow:hidden     子浮动元素算溢出
		          指定溢出隐藏，子元素当高度做隐藏
		
		2.浮动卡主：父级元素高度不够，某个子元素【高度超过其他元素】
		  解决方案1：找到父级元素，看需求加宽【横向显示】，看需求加高【纵向显示】
		  解决昂饭2：找到卡主元素，清除浮动
		-->
		<div id="father">
			<div class="d1">1</div>
			<div class="d2">2</div>
			<div class="d3">3</div>
			<div class="d4">4</div>
			<div class="d5">5</div>
		</div>
	</body>
</html>